<template>
	<u-navbar :fixed='true' :title="courseName" leftIconSize="40" v-if="needBack"
		titleStyle="font-size:18px;font-weight:600;max-width:1200px;" @leftClick="backHandle" :placeholder='true'>
	</u-navbar>
	<view v-if="this.selectedItem" style="background-color: white;max-width:1200px;" @touchstart="touchStart"
		@touchend="touchEnd">
		<u-line width="100%" color="#E2E3E7"></u-line>
		<view v-if="!isExamStatus">
			<u-row>
				<u-col :span="12/typeList.length" v-for="(item, index) in typeList">
					<view style="text-align: center;padding-top:10px;padding-bottom:10px;"
						@click="changeType(item,index)">
						<text :class="selectTypeIndex == index ? 'underline' : 'color-gray'">{{item.name}}</text>
					</view>
				</u-col>
			</u-row>
		</view>
		<view v-if="isExamStatus && !isHistoryStatus" style="display: flex;align-items: center;margin: 9px 0 9px 0px;">
			<image src="../../static/image/clock.png"
				style="margin-left:15px;margin-right: 7px; width:21px;height:21px;" @click="showAnswer"></image>
			<u-count-down :time="examTimeSecond * 1000" format="HH:mm:ss" autoStart millisecond @change="onTimeChange"
				@finish="onTimeFinish">
				<view class="color-blue font-x font-b">
					<text>{{ timeData.hours>=10?timeData.hours:'0'+timeData.hours}}:</text>
					<text>{{ timeData.minutes>=10?timeData.minutes:'0'+timeData.minutes }}:</text>
					<text>{{ timeData.seconds>=10?timeData.seconds:'0'+timeData.seconds }}</text>
				</view>
			</u-count-down>
		</view>
		<u-line width="100%" color="#E2E3E7"></u-line>
		<view :animation="animationData">
			<view style="padding-left:10px;padding-right: 10px;">
				<view style="padding-top: 15px;padding-bottom: 15px;">
					<u-row>
						<u-col span="4">
							<text
								class="color-blue">[{{ selectedItem.caseFlag == 0 ? selectedItem.typeName : '案例题'}}]</text>
						</u-col>
						<u-col span="4" text-align="center">
							<text class="color-blue font-small">{{ practiceMode }} </text>
						</u-col>
						<u-col span="4" text-align="right">
							<text><text
									class="color-blue">{{ selectedIndex + 1 }}</text>/{{ currentQuestionList.length }}</text>
						</u-col>
					</u-row>
				</view>
				<template v-if="selectedItem.caseFlag == 1">
					<view>
						<u-parse :content="formatTitle(selectedIndex + 1, selectedItem.caseMaterials, '[背景材料]')"
							previewImg></u-parse>
					</view>
					<u-line style="width: 100%;" color="#366DE8" dashed="true" margin="13px 0 13px 0"></u-line>

					<view style="margin-bottom: 10px;" class="color-black">
						<u-parse :content="formatTitle('', selectedItem.content, '[' + selectedItem.typeName + ']')"
							previewImg></u-parse>
					</view>

				</template>
				<view v-if="selectedItem.caseFlag == 0" style="margin-bottom: 10px;" class="color-black"><u-parse
						:content="formatTitle(selectedIndex + 1, selectedItem.content)" previewImg></u-parse></view>
				<view v-for="(option, optionIndex) in selectedItem.optionList" :key="option.option"
					style="margin-bottom: 10px;">
					<view class="option-item" @click="changeAnswer(selectedItem, optionIndex)">
						<view style="display:flex;align-items: center; padding-top:10px;padding-bottom:10px;">
							<view :class="calcOptionClass(selectedItem, optionIndex)" style="min-width:36px;">
								<text>{{ option.option }}</text>
							</view>
							<view style="margin-left:15px" class="option_content">
								<u-parse :content="option.content" previewImg></u-parse>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view v-if="isShowAnswer || isHistoryStatus || practiceMode == '背题模式'"
				style="background-color: #F6F7FB;padding:15px;">
				<view style="background-color: white;padding:15px;border-radius: 6px;"
					v-if="selectedItem.typeCode != 'fillBlank' && selectedItem.typeCode != 'shortAnswer'">
					<view style="padding-bottom:15px;" class="font-b color-black">
						{{selectedItem.answer == selectedItem.studentAnswer ? '回答正确' : '回答错误'}}
					</view>
					<view style="padding:15px;background-color: #F6F7FB;border-radius: 6px;">
						<u-row style="color:#999999;">
							<u-col span="6">
								<view style="text-align: center;">正确答案</view>
								<view
									style="color:#38D481;margin-top:5px;font-weight: 600;text-align: center;font-size: 24px;height: 30px;"
									v-html="selectedItem.answer">
								</view>
							</u-col>
							<u-line direction="col" color="#999999" length="50"></u-line>
							<u-col span="6">
								<view style="text-align: center;">我的答案</view>
								<view
									:class="selectedItem.answer == selectedItem.studentAnswer ? 'color-green' : 'color-red'"
									style="margin-top:5px;font-weight: 600;text-align: center;font-size: 24px;height: 30px">
									<view :style="selectedItem.studentAnswer ? 'font-size: 24px;' : 'font-size:18px'">
										{{selectedItem.studentAnswer ? selectedItem.studentAnswer : '未作答'}}
									</view>
								</view>
							</u-col>
						</u-row>
					</view>
				</view>
				<!--        填空和简答-->
				<view v-else style="background-color: white;padding:15px;border-radius: 6px;">
					<view style="padding-bottom:15px;" class="font-b color-black">正确答案</view>
					<view
						style="padding:15px;background-color: #F6F7FB;border-radius: 6px;color:#38D481;margin-top:5px;font-weight: 600;text-align: left;height: auto;overflow-y: scroll">
						<u-parse :content="selectedItem.answer" previewImg></u-parse>
					</view>
				</view>
				<!-- 试题解析 -->
				<view v-if="selectedItem.analysisContent" style="background-color: #F6F7FB;padding:15px 0;">
					<view style="background-color: white;border-radius: 6px;">
						<view style="background-color: white;padding:15px;border-radius: 6px;">
							<view style="padding-bottom:15px;" class="font-b color-black">
								试题解析
							</view>
							<view
								style="padding:15px;background-color: #F6F7FB;border-radius: 6px;height: auto;overflow-y: scroll">
								<u-parse :content="selectedItem.analysisContent" previewImg></u-parse>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view style="height:60px;"></view>
		<view style="position: fixed;bottom:0;width:100%;background-color: white;
				border-top: 1px solid #E2E3E7;padding-bottom: 20px;max-width:1200px">
			<view>
				<u-row>
					<u-col span="3" text-align="center" class="option-item">
						<view>
							<image src="../../static/image/arrow-left.png" class="bottom-item"
								style="width:20px;height:40px;" @click="preQuestion"></image>
						</view>
					</u-col>
					<u-col v-if="!isExamStatus && !isHistoryStatus && practiceMode != '背题模式'" span="3"
						text-align="center" class="option-item" @click="showAnswer">
						<view style="text-align: center;">
							<image src="../../static/image/show-answer.png"
								style="width:20px;height:30px;padding-top:10px;"></image>
						</view>
						<view><text class="font-mini">查看答案</text></view>
					</u-col>
					<u-col :span="isExamStatus || isHistoryStatus || practiceMode == '背题模式' ? 6 : 3" text-align="center"
						class="option-item" @click="showAnswerSheet">
						<view style="text-align: center;">
							<image src="../../static/image/answer-sheet.png"
								style="width:20px;height:30px;padding-top:10px;"></image>
						</view>
						<view><text class="font-mini">答题卡</text></view>
					</u-col>
					<u-col span="3" text-align="center" class="option-item ">
						<view>
							<image src="../../static/image/arrow-right.png" class="bottom-item"
								style="width:20px;height:40px;" @click="nextQuestion"></image>
						</view>
					</u-col>
				</u-row>
			</view>
		</view>

		<!--    </view>-->
		<u-popup :show="isShowAnswerSheet" mode="bottom" @close="closeAnswerSheet" :round="20"
			style="width: 100%;background-color: white;" z-index="10070">
			<view style="width: 100%; padding: 15px;">
				<u-row style="width: 100%;">
					<u-col span="8">
						<view style="display: flex;">
							<template v-if="isHistoryStatus">
								<view class="circle-small circle-right" style="margin-top: 5px;margin-right: 7px;">
								</view>
								<text style="margin-right: 13px;">正确</text>
								<view class="circle-small circle-wrong" style="margin-top: 5px;margin-right: 7px;">
								</view>
								<text style="margin-right: 13px;">错误</text>
							</template>
							<template v-if="!isHistoryStatus">
								<view class="circle-small circle-answer" style="margin-top: 5px;margin-right: 7px;">
								</view>
								<text style="margin-right: 13px;">已做</text>
							</template>
							<view class="circle-small" style="margin-top: 5px;margin-right: 7px;"></view>
							<text>未做</text>
						</view>
					</u-col>
					<u-col span="4" text-align="right">
						<view style="display: flex;justify-content: flex-end" @click="closeAnswerSheet">
							<view style="margin-right: 5px;">收起</view>
							<u-icon style="margin-top: 3px;" name="arrow-down"></u-icon>
						</view>
					</u-col>
				</u-row>
				<u-line width="100%;" margin="15px 0 5px 0"></u-line>
				<view style="height: 400px;overflow: auto;">
					<template v-for="(groupItem, groupIndex) in currentQuestionGroupList" :key="groupIndex">
						<view class="color-black" style="padding-top:10px;padding-bottom:5px;">{{groupItem.name}}</view>
						<view
							style="display: grid;flex-flow: wrap;grid-template-columns: repeat(6, 1fr);align-items: center;">
							<view v-for="(item,index) in groupItem.list" :key="index">
								<view class="circle" :class="getAnswerSheetClass(item)" style="margin: 10px;"
									@click="changeSelectedIndex(item.indexValue)">
									<text style="font-weight: 300;">{{ item.indexValue + 1 }}</text>
								</view>
							</view>
						</view>
					</template>
				</view>

			</view>
			<view class="padding-top:10px" style="border-top: 1px solid #E2E3E7;padding:5px 15px 5px 15px"
				v-if="!isHistoryStatus">
				<u-button type="primary" color="#366DE8" shape="circle" text="提交试卷" @click="submit"></u-button>
			</view>
		</u-popup>
		<u-modal :show="showConfirmDialog" :title="dialogTitile" :showCancelButton="showCancelBtn"
			:content='dialogContent' @confirm="dialogConfirmHandle" @cancel="dialogCancelHandle"></u-modal>
	</view>

</template>

<script>
	import aes from '../../utils/aes'
	import pageRoute from '../../utils/pageRoute'
	import {
		startPractice,
		continuePractice,
		startTest,
		submitPaper,
		getPaperById,
		getOpenPaperById
	} from '@/api/paper/paper.js'
	import onShare from '@/utils/share.js';

	const {
		onShareAppMessage,
		onShareTimeline
	} = onShare()
	export default {
		data() {
			return {
				courseName: '',
				practiceMode: '背题模式',
				isExamStatus: false,
				isHistoryStatus: true,
				isOnlyWrong: false,
				needLogin: false,
				uid: null,
				examTimeSecond: 3000,
				currentQuestionList: [],
				currentQuestionGroupList: [],
				selectedItem: null,
				selectedIndex: 0,
				isShowAnswerSheet: false,
				isShowAnswer: false,
				startData: {
					clientX: 0,
					clientY: 0
				},
				answerOptionArray: ["A", "B", "C", "D", "E"],
				selectTypeIndex: 0,
				typeList: [{
					name: '全部',
					code: 'all'
				}],
				questionList: [],
				showConfirmDialog: false,
				showCancelBtn: false,
				dialogTitile: '',
				dialogContent: '',
				dialogConfirmHandle: null,
				dialogCancelHandle: null,
				timeData: {
					hours: 0,
					minutes: 0,
					seconds: 0
				},
				animation: {},
				animationData: {},
				isNeedSubmit: true,
				urlParamObj: null,
				needBack: true,
				isPC: false
			}
		},
		onLoad(res) {
			this.initLoad(res);
			this.animation = uni.createAnimation({
				timingFunction: 'ease',
				duration: 150
			});
			if (!res) {
				res = {};
			}
			this.urlParamObj = res
			this.practiceMode = res.mode == 'recive' ? '背题模式' : '答题模式';
			this.isExamStatus = res.type == 'exam' ? true : false;
			this.isOnlyWrong = res.onlyWrong == "true" ? true : false;
			let isStart = res.isStart == 'false' ? false : true;
			this.isHistoryStatus = res.isHistory == "true" ? true : false;
			this.courseName = res.courseName ? res.courseName : '';
			this.needLogin = res.needLogin == 'false' ? false : true;

			if (this.urlParamObj.sk || this.urlParamObj.needBack) {
				this.needBack = false;
			}

			this.selectedIndex = res.selectedIndex ? parseInt(res.selectedIndex) : 0;
			if (this.isHistoryStatus) {
				let id = res.id;
				if (!this.needLogin) {
					getOpenPaperById({
						id: id
					}).then(this.ajaxListQuestion);
				} else {
					getPaperById({
						id: id
					}).then(this.ajaxListQuestion);
				}
				return;
			}
			if (this.isExamStatus) {
				this.practiceMode = '';
				startTest().then(this.ajaxListQuestion);
				return;
			}
			let mode = res.mode == 'recive' ? 'recitation' : 'answer';
			if (isStart) {
				startPractice({
					modeCode: mode
				}).then(this.ajaxListQuestion);
			} else {
				continuePractice().then(this.ajaxListQuestion);
			}
		},

		onUnload() {
			let answeredCount = this.calcAnsweredCount();
			if (this.isHistoryStatus || answeredCount == 0) {
				return;
			}

			if (this.isNeedSubmit) {
				this.submit(true);
			}
			console.log("onUnload--------------------");
		},
		methods: {
			initLoad(res) {
				if (!res) {
					return null;
				}
				let token = res.sk;
				if (token) {
					uni.setStorageSync('token', token);
				}
			},
			ajaxListQuestion(res) {
				let data = res.data;
				let jsonData = this.des(data);
				this.initData(jsonData);
			},
			initData(data) {
				// this.onStartListenScreenshot();
				this.uid = data.trainKey;
				let effectiveMinute = data.effectiveMinute;
				if (effectiveMinute) {
					this.examTimeSecond = effectiveMinute * 60;
				}
				if (data.practiceModeCode) {
					this.practiceMode = data.practiceModeCode == 'recitation' ? '背题模式' : '答题模式';
				}
				if (data.courseName) {
					this.courseName = data.courseName ? data.courseName : '未知';
				}
				this.questionList = data.questionList;
				console.log(this.questionList)
				if (this.questionList.length == 0) {
					uni.showToast({
						title: "题库为空",
						icon: "none"
					});
					this.backHandle();
					return;
				}
				let lastBgContent = "";
				this.questionList.forEach((item) => {
					if (item.caseFlag == 1) {
						if (item.caseMaterials) {
							lastBgContent = item.caseMaterials;
						} else {
							item.caseMaterials = lastBgContent;
						}
					}
				});
				let wrongList = [];
				if (this.isOnlyWrong) {
					this.questionList.forEach((item) => {
						let isWrong = item.studentAnswer ? item.answer != item.studentAnswer : false;
						if (isWrong) {
							wrongList.push(item);
						}
					});

					if (wrongList.length == 0) {
						uni.showToast({
							title: "无错题",
							icon: "none"
						});
						this.backHandle();
						return;
					}
					this.questionList = wrongList;
				}
				this.currentQuestionList = this.questionList;
				this.changeTypeList();
				if (!this.isStart && !this.isHistoryStatus) {
					this.changeType(this.typeList[0], 0);
				}
				this.changeSelectedIndex(this.selectedIndex);
			},
			changeTypeList() {
				let list = [{
					name: '全部',
					code: 'all'
				}]
				let map = {
					single: false,
					multiple: false,
					judge: false,
					case: false,
					fillBlank: false,
					shortAnswer: false
				}
				let codeNameMap = {
					single: '单选',
					multiple: '多选',
					judge: '判断',
					case: '案例',
					fillBlank: '填空',
					shortAnswer: '简答'
				};
				console.log(this.questionList, 'this.questionList')
				this.questionList.forEach((item) => {
					if (item.caseFlag) {
						if (!map.case) {
							map.case = true;
							list.push({
								name: '案例',
								code: 'case'
							})
						}
					} else if (map[item.typeCode] == false) {
						map[item.typeCode] = true;
						list.push({
							name: codeNameMap[item.typeCode],
							code: item.typeCode
						})
					}
				});
				this.typeList = list;
				this.typeSpaceNum = 12 / this.typeList.length
			},
			submit(isForce) {
				this.isNeedSubmit = false;
				if (!isForce) {
					let isAllAnswered = true;
					this.questionList.forEach((item) => {
						if (!item.studentAnswer) {
							isAllAnswered = false;
						}
					});
					if (!isAllAnswered) {
						let self = this;
						this.popUpConfirmDialg('提示', '你还有题目未做完，确定提交？ ', true, function() {
							self.submit(true);
							self.showConfirmDialog = false;
						});
						return;
					}
				}

				let data = {};
				data.trainKey = this.uid;
				let answerList = [];
				this.questionList.forEach((item) => {
					if (item.studentAnswer) {
						let answer = {};
						answer.id = item.id;
						answer.answer = item.studentAnswer;
						answerList.push(answer);
					}
				});
				data.answerList = answerList;
				this.beforeSubmit(data);
				submitPaper(data).then(this.submitHandle);
			},
			beforeSubmit(data) {
				if (!this.urlParamObj.outsideBankId) {
					return;
				}
				let assocReq = {}
				assocReq.outsideBankId = this.urlParamObj.outsideBankId;
				assocReq.outsideBankType = this.urlParamObj.outsideBankType;
				assocReq.outsideCourseId = this.urlParamObj.outsideCourseId;
				assocReq.outsideOrderItemId = this.urlParamObj.outsideOrderItemId;
				assocReq.mobile = this.urlParamObj.mobile;
				data.assocReq = assocReq
			},
			submitHandle(res) {
				let id = res.data;
				let mode = this.isExamStatus ? true : this.urlParamObj.type ? this.urlParamObj.type : 'practice';
				pageRoute.route('pages/report/report', {
					id: id,
					mode: mode,
					showBackHome: this.needBack,
					isBback: this.needBack,
					username: this.urlParamObj.username,
					examName: this.urlParamObj.examName,
					isPC: this.isPC
				});
			},
			backHandle() {
				if (this.isHistoryStatus) {
					this.backPage();
					return;
				}

				let self = this;
				let answeredCount = this.calcAnsweredCount();
				if (answeredCount == 0) {
					this.backPage();
					return;
				}
				this.popUpConfirmDialg('提示', '是否要提交试卷？', true, function() {
					self.submit(true);
					self.showConfirmDialog = false;
				}, function() {
					self.isNeedSubmit = false;
					self.backPage();
					self.showConfirmDialog = false;
				});
			},
			changeSelectedIndex(index) {
				if (index <= -1) {
					return false;
				}
				if (index >= this.currentQuestionList.length) {
					return false;
				}
				this.selectedIndex = index;
				this.selectedItem = this.currentQuestionList[this.selectedIndex];
				console.log(this.selectedItem, 'this.selectedItem')
				this.isShowAnswerSheet = false;
				this.isShowAnswer = false;
				this.generateQuestionGroupList();

				return true;
			},
			changeType(item, index) {
				if (item.code == 'all') {
					this.currentQuestionList = this.questionList;
				} else if (item.code == 'case') {
					this.currentQuestionList = this.questionList.filter(val => val.caseFlag == 1);
				} else {
					this.currentQuestionList = this.questionList.filter(val => val.caseFlag == 0 && val.typeCode == item
						.code);
				}
				this.selectTypeIndex = index;
				let selectedIndex = 0;
				for (let i = 0; i < this.currentQuestionList.length; i++) {
					if (!this.currentQuestionList[i].studentAnswer) {
						selectedIndex = i - 1;
						break;
					}
				}
				if (selectedIndex <= -1) {
					selectedIndex = 0;
				}
				this.changeSelectedIndex(selectedIndex);
			},
			generateQuestionGroupList() {
				let rsList = [];
				let lastCode = "";
				let list = [];
				let i = 0;
				this.currentQuestionList.forEach((item) => {
					item.indexValue = i;
					let typeCode = item.caseFlag == 1 ? "case" : item.typeCode;
					let typeName = item.caseFlag == 1 ? "案例题" : item.typeName;
					if (lastCode == typeCode) {
						list.push(item);
					} else {
						list = [];
						let groupItem = {};
						groupItem.code = typeCode;
						groupItem.name = typeName;
						groupItem.list = list;
						list.push(item);

						rsList.push(groupItem);
						lastCode = typeCode;
					}
					i++;
				});
				this.currentQuestionGroupList = rsList;
			},
			nextQuestion() {
				let isReciteMode = this.practiceMode == "背题模式";
				if (isReciteMode && this.selectedItem) {
					let isRight = this.selectedItem.answer == this.selectedItem.studentAnswer;
					if (!isRight && this.selectedItem.typeCode != 'fillBlank' && this.selectedItem.typeCode !=
						'shortAnswer') {
						this.popUpConfirmDialg("提示", '背题模式，必须选择正确答案，才能进入下一题！')
						return;
					}
				}
				let success = this.changeSelectedIndex(this.selectedIndex + 1);
			},
			preQuestion() {
				let success = this.changeSelectedIndex(this.selectedIndex - 1);
			},
			showAnswerSheet() {
				this.isShowAnswerSheet = true;
			},
			closeAnswerSheet() {
				this.isShowAnswerSheet = false;
			},
			showAnswer() {
				this.isShowAnswer = true;
			},
			changeAnswer(item, optionIndex) {
				let answer = this.answerOptionArray[optionIndex];
				if (item.typeCode == 'multiple') {
					let studentAnswer = item.studentAnswer;
					let optionList = item.optionList;
					let optionItem = optionList[optionIndex];
					if (optionItem.select) {
						optionItem.select = false;
					} else {
						optionItem.select = true;
					}
					answer = "";
					optionList.forEach((item) => {
						if (item.select) {
							answer += item.option;
						}
					})
				}
				item.studentAnswer = answer;
				if (answer) {
					item.hasDone = true;
				}
				if (this.practiceMode != '背题模式' && !this.isHistoryStatus && item.typeCode != 'multiple') {
					this.nextQuestion();
				}
			},
			calcOptionClass(item, optionIndex) {
				let rsClass = "circle";
				if (item.typeCode == 'multiple') {
					rsClass = "square";
				}
				let optionName = this.answerOptionArray[optionIndex];
				if (item.studentAnswer && item.studentAnswer.indexOf(optionName) != -1) {
					rsClass = rsClass + ' circle-answer';
				}

				return rsClass;
			},
			touchStart(e) {
				this.startData.clientX = e.changedTouches[0].clientX;
				this.startData.clientY = e.changedTouches[0].clientY;
			},
			touchEnd(e) {
				const subX = e.changedTouches[0].clientX - this.startData.clientX;
				const subY = e.changedTouches[0].clientY - this.startData.clientY;
				let isUpDown = Math.abs(Math.abs(subY) - Math.abs(subX)) > 30;
				if (isUpDown && (subY > 50 || subY < -50)) {
					console.log(subY + '上下滑' + subX)
				} else {
					if (subX > 30) {
						this.preQuestion();
					} else if (subX < -30) {
						this.nextQuestion();
					} else {}
				}
			},
			popUpConfirmDialg(title, content, showCancelBtn, confirmHandle, cancelHandle) {
				// this.isShowAnswerSheet = false;
				this.dialogTitile = title;
				this.dialogContent = content;
				this.showConfirmDialog = true;
				this.showCancelBtn = showCancelBtn ? true : false;
				this.dialogConfirmHandle = confirmHandle ? confirmHandle : this.closeConfirmDialog;
				this.dialogCancelHandle = cancelHandle ? cancelHandle : this.closeConfirmDialog;
			},
			closeConfirmDialog() {
				this.showConfirmDialog = false;
			},
			onTimeChange(e) {
				this.timeData = e
			},
			onTimeFinish() {
				let seft = this;
				this.popUpConfirmDialg('提示', '考试时间已到，试卷已自动提交', false, function() {
					seft.submit(true);
				})
			},
			formatTitle(index, content, preContent) {
				let preTitle = "";
				if (index) {
					preTitle = index + "."
				}
				if (!content) {
					content = "";
				}
				if (preContent) {
					preTitle = preTitle + "<span style='font-size:14px;color:#366DE8'>" + preContent + "</span>";
				}
				return preTitle + content;
			},
			getAnswerSheetClass(item) {
				if (!item.studentAnswer) {
					return '';
				}
				if (!this.isHistoryStatus) {
					return 'circle-answer';
				}
				return item.answer == item.studentAnswer ? 'circle-right' : 'circle-wrong';
			},
			calcAnsweredCount() {
				let answeredCount = 0;
				this.questionList.forEach((item) => {
					if (item.studentAnswer) {
						answeredCount++;
					}
				});
				return answeredCount;
			},
			des(data) {
				let valueStr = aes.decrypt(data);
				let dataJson = JSON.parse(valueStr);
				return dataJson;
			},
			backPage() {
				uni.navigateBack({
					delta: 1
				});
			},
			onStartListenScreenshot() {
				let screenshotModule = uni.requireNativePlugin("Chen-Screenshot")
				screenshotModule.onStartListenScreenshot((result) => {
					uni.showToast({
						title: '开启监听截屏事件：' + JSON.stringify(result),
						icon: "none"
					})
					this.selectedItem = {};
				})
			},
		}
	}
</script>

<style src="../../customUI/practice.css"></style>